<!DOCTYPE html>
<html lang="en">
<head>
    <title>Chat room</title>
    <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
</head>
<body>
    <table align="center">
        <tr>
            <td>
                <label>Username: </label>
                <input type="text" id="username">
            </td>
        </tr>
        <tr>
            <td>
                <label>room: </label>
                <input type="text" id="room">
                <button id="connect">Connect</button>
            </td>
        </tr>
        <tr>
            <td>
                <label>Content: </label><br>
                <textarea disabled id="output" rows="10" cols="50"></textarea>
            </td>
        </tr>
        <tr>
            <td>
                <label>Input: </label><br>
                <textarea disabled id="input" rows="3" cols="50"></textarea>
            </td>
        </tr>
        <tr>
            <td>
                <button id="send">Send</button>
            </td>
        </tr>
    </table>
    <script src="./client.js"></script>
</body>
</html>